<!--
* @description  : 涉案人页面 扩展信息组件
* @descriptionDetail: 涉案人页面 扩展信息组件
* @copyright    : 浙江烟草
* @author       : mc
* @create       : 2022-07-25 16:15:38
-->
<template>
  <view class="page"> 
    <theme-navbar
      :is-white="false"
      :isBack="false"
      backColor="#2b85e4"
      title="扩展信息"
    >
      <view class="nav-right-icon" @tap="onSure">
        确定
      </view>
    </theme-navbar>
    <view class="content" style="padding: 20rpx 30rpx;">
      <u-form :model="dataForm" label-width="auto" label-position="top" :errorType="['border-bottom','message',]" ref="uForm1">
        <u-form-item rightIcon="arrow-right" prop="infoType" :required="true" label="信息分类">
          <dic-input
            :keyWord="$u.dic.DIC_KEYS.INFO_TYPE" 
            :dicCode="dataForm.infoType" 
            :border="false" 
            type="text" 
            :disabled="true"
            :select-open="dicSelectOpen($u.dic.DIC_KEYS.INFO_TYPE)" 
            placeholder="请选择" 
            v-model="dataForm.infoTypeStr" 
            @changeInputModelData="(name)=>{$set(dataForm, 'infoTypeStr', name)}" 
            @click="showDic($u.dic.DIC_KEYS.INFO_TYPE,dataForm.infoType)"
          />
        </u-form-item>
        <u-form-item :required="true" prop="infoItem" label="信息项">
          <u-input type="text" placeholder="请输入信息项" v-model="dataForm.infoItem"></u-input>
        </u-form-item>
        <u-form-item label="信息内容">
          <u-input type="textarea" placeholder="请输入信息内容" v-model="dataForm.infoContent"></u-input>
        </u-form-item>
      </u-form>
    </view>
    <dic-choice :keyWord="dicKeyWords" :currentSelect="dicCurrentSelect" v-model="dicShow" @confirm="selectDicConfirm"></dic-choice>
  </view>
</template>

<script> 
import DicChoice from "@/components/dic_choice.vue";
import DicInput from "@/components/dic_input.vue";
/** 
 * 扩展信息
 */
export default {
  name: "ExtInfoItem",
  components:{
    DicChoice,DicInput,
  },
  props: {
    // 单选或多选, 默认单选
    oldData: {
      type: Object,
      default: undefined,
    },
  },
  data() {
    return {
      dicShow: false, // dic_select 是否显示
      dicKeyWords: "", // dic 关键字
      dicCurrentSelect: "", // dic 当前选择项
      dataForm:{
        infoType:"",
        infoTypeStr:"",
        infoItem:"",
        infoContent:"",
        id:"", // 标识，区分修改或者新增
      },
    };
  }, 
  onLoad() {
		
  },
  created() {
    if(this.oldData){
      this.objMerge(this.dataForm, this.oldData);
    }
  },
  methods: {
  // 数据字典组件选择事件
    dicSelectOpen (keyWord) {
      if (this.dicKeyWords == keyWord && this.dicShow) {
        return true;
      }
      return false;
    },
    showDic (key, cur) {
      if (this.dicShow) return;
      this.dicKeyWords = key;
      this.dicCurrentSelect = cur;
      this.dicShow = true;
    },
    selectDicConfirm (e) {
      if (this.dicKeyWords == this.$u.dic.DIC_KEYS.INFO_TYPE) {
        this.dataForm.infoTypeStr = e[0].label;
        this.dataForm.infoType = e[0].extra.bcbCode;
      }
    },
    // 点击确定
    onSure() {
      if(this.$u.test.isEmpty(this.dataForm.infoType)){
        this.$u.toast('请选择信息类型');
        return;
      }
      if(this.$u.test.isEmpty(this.dataForm.infoItem)){
        this.$u.toast('请输入信息项');
        return;
      }
      this.$emit("confirm", this.dataForm);
    },
  },
};
</script>

<style lang="scss" scoped>
.header-list {
  position: fixed;
  top: 44px;
  left: 0px;
  width: 100%;
  z-index: 999;
}
#orgListContainer {
  margin-top: 45px;
}
.nav-right-icon {
  padding-right: 15px;
  color: #FFF;
}
/deep/ .u-tab-item {
  max-width: 160px;
}
</style>